<template>
    <h2>详情排房</h2>

    <table border="1">
        <tr>
            <td>房号</td>
            <td>
                <select v-model="info.trN_Id">
                    <option :value="0">--请选择--</option>
                    <option v-for="item in num" :value="item.trN_Id">{{item.trN_Name}}</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>房型</td>
            <td>
                <select v-model="info.trT_Id">
                    <option :value="0">--请选择--</option>
                    <option v-for="item in typ" :value="item.trT_Id">{{item.trT_Name}}</option>
                </select>
            </td>
        </tr>
        <tr>
            <input type="button" value="返回" @click="Add"/>
        </tr>
    </table>
</template>
<script setup lang="ts">
    import {ref,onMounted} from 'vue';
    import axios from 'axios';
    import {useRoute,useRouter} from 'vue-router';
    const route=useRoute();
    const router=useRouter();

    const info=ref({
         trO_Id:route.params.id,
        trN_Id:0,
        trT_Id:0
       
    })

    onMounted(()=>{
        //详情
        FanTian();
        //房号下拉
        XiaNumber();
        //房型下拉
        XiaType();
        
    })

    const num=ref([{
        trN_Id:0,
        trN_Name: ""
    }]);

    const typ=ref([{
        trT_Id: 1,
        trT_Name: ""
    }]);

    //房号下拉
    const XiaNumber=()=>{
        axios.get("https://localhost:7038/api/RoomOrder/XiaRoomNUmber")
        .then(res=>{
            num.value=res.data;
        })
        .catch(err=>{
            console.log(err);
        })
    }

    //房型下拉
    const XiaType=()=>{
        axios.get("https://localhost:7038/api/RoomOrder/XiaRoomType")
        .then(res=>{
            typ.value=res.data;
        })
        .catch(err=>{
            console.log(err);
        })
    }

    //跳回显示
    const Add=()=>{
        router.push({
            name:"ShowOrder"
        })
    }

    //反填数据
    const FanTian=()=>{
        axios.get("https://localhost:7038/api/RoomOrder/GetOrdrtXiang",{
            params:{
                id:route.params.id
            }
        })
        .then(res=>{
            info.value=res.data;
        })
        .catch(err=>{
            console.log(err);
        })
    }


</script>
